<div class="filter">
    <div class="f1 item" style="width: 90px;">
        <input type="text" class="am-form-field" placeholder="起始日期" id="start"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f2 item" style="width: 90px;">
        <input type="text" class="am-form-field" placeholder="结束日期" id="end"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f6 item">
        <select data-am-selected>
            <option value="-1">全部渠道</option>
            <option value="manual">后台添加</option>
            <option value="alipay">支付宝</option>
            <option value="wechat">微信</option>
            <option value="bank">银行转账</option>
        </select>
    </div>

    <div class="f9 item">
        <select data-am-selected>
            <option value="-1">全部状态</option>
            <option value="0">新增</option>
            <option value="1">完成</option>
            <option value="2">拒绝</option>
        </select>
    </div>

    <div class="f3 item">
        <input type="text" class="am-form-field" placeholder="用户名" />
    </div>

    <div class="button item">
        <button type="button" class="am-btn am-btn-primary">查看</button>
    </div>

    <div class="f4 item" style="margin-left: 20px; color: red;">
        <label class="am-checkbox">
            <input type="checkbox" class="auto" value="" data-am-ucheck> 每8秒自动刷新
        </label>
    </div>
</div>

<table class="am-table am-table-bordered am-table-striped am-table-compact" id="result-table">
  <thead>
  <tr>
    <th width="90px">时间</th>
    <th width="160px">用户/ID</th>
    <th width="44px">头像</th>
    <th width="140px">类型</th>
    <th width="60px">金额</th>
    <th width="60px">余额</th>
    <th>备注</th>
    <th width="100px">状态</th>
  </tr>
  </thead>
  <tbody>
  </tbody>
</table>
<div class="zxf_pagediv"></div>

<script src="../public/all/js/page_list.js"></script>
<script>
    $(".f1 input").datepicker({format: 'yyyy-mm-dd'});
    $(".f2 input").datepicker({format: 'yyyy-mm-dd'});
    $(".f1 input").datepicker("setValue", new Date().Format("yyyy-MM-dd"))
    $(".f2 input").datepicker("setValue", new Date().Format("yyyy-MM-dd"))

    var _f = Util.queryTemplate($("#result-table tbody"), ".zxf_pagediv", $(".button button"), function(page, size, cb) {
        var data = {
            pageNum: page,
            pageSize: size,
            type: "deposit",
            channel: "handOper",
        };
        var v = $(".f1 input").val().trim();
        if (v) data.start = v;
        var v = $(".f2 input").val().trim();
        if (v) data.end = v;
        var v = $(".f9 select").val();
        if (v != -1) data.state = v;
        var v = $(".f3 input").val().trim();
        if (v) data.uid = v;
        var v = $(".f6 select").val();
        if (v != -1) data.channel2 = v;

        startLoading();
        CMD.gquery_account_log(data, function(r) {
            stopLoading();
            cb(r);
        });
    }, function(table, list, sum) {
        if (Util.isEmpty(list)) {
            table.append("<tr><td colspan='9'>暂无数据</tr>");
            return;
        }

        // sum
        var tr = $("<tr></tr>");
        tr.append("<td colspan='4'>合计</td>");
        tr.append("<td>" + (sum/100).toFixed(2) + "</td>");
        tr.append("<td colspan='4'></td>");
        table.append(tr);

        for (var i in list) {
            var d = list[i];
            var tr = $("<tr></tr>");
            tr.append("<td>" + d.start + "</td>");
            tr.append("<td>" + (d.user.nick || d.user.mobile) + '<br/>' + d.user.code + "</td>");
            tr.append("<td><img src='" + d.user.portrait + "'/></td>");
            tr.append("<td>" + (d.channel2 ? Util.convertChannel(d.channel2) : '') + "</td>");
            tr.append("<td>" + (d.amount/100) + "</td>");
            tr.append("<td>" + (d.balance/100) + "</td>");
            var memo = Util.convertMemo(d);
            tr.append("<td class='l'>" + memo + "</td>");
            tr.append("<td>" + Util.drawBalanceLogState(d) + "</td>");
            table.append(tr);
        }

        Util.registerGroupBalanceOper(list, table, function() { _f(); })
    });
</script>


<style type="text/css">
.am-table img {
    width: 40px;
    height: 40px;
}
#result-table td {
    line-height: 20px;
    vertical-align: middle;
}
</style>